/*
 * @Author: yxfan
 * @Date: 2024-06-04 19:26:15
 * @LastEditTime: 2024-06-04 19:59:13
 * @FilePath: /umi-demo/src/pages/demo/KeepAlive/index.jsx
 * @Description:
 */
import { useState, useEffect } from 'react';
import KeepAlive, { AliveScope } from './KeepAliveFn';

function Counter() {
    const [count, setCount] = useState(0);

    useEffect(() => {
        return () => {};
    }, []);

    return (
        <div>
            count: {count}
            <button onClick={() => setCount((count) => count + 1)}>add</button>
        </div>
    );
}

export default (props) => {
    const [show, setShow] = useState(true);
    return (
        <AliveScope>
            <div>
                <button onClick={() => setShow((show) => !show)}>Toggle</button>

                <p>有 KeepAlive</p>
                {show && (
                    <KeepAlive id="Test">
                        <Counter />
                    </KeepAlive>
                )}
            </div>
        </AliveScope>
    );
};
